import { Component, Vue } from 'vue-property-decorator'
import InfoBlock from '@profile/util/info_block/Index.vue';
import axios from '@axios/user';
import { Addme, QuestionAndAnswer } from '@entity/user';

@Component({
    components: {
        InfoBlock
    }
})
export class AddMeMethod extends Vue {

    /** 添加方式 */
    private baseMode: Array<string> = ["需要验证信息", "可以直接添加", "正确回答问题"]

    /** 添加模式（已选的方式） */
    private addMode: string = '';

    /** 需要正确回答的问题 */
    private questions: Array<QuestionAndAnswer> = [];

    /** 源数据 */
    private source: string = '';

    /**
     * 从服务器获取当前用户的添加好友的方式,
     * 并存为源数据
     */
    created() {
        axios.friend.queryAddMethod(this.$store.getters.me().id).then((res: Addme) => {
            this.addMode = this.baseMode[res.mode - 1]
            this.questions = res.qaList;
            this.source = JSON.stringify(this.produceData())
        });
    }

    /**
     * 添加问题
     */
    private addQuestion(): void {
        if (this.questions.length === 3) {
            '最多只能添加三个问题'.notifyWarn();
        } else {
            this.questions.push(new QuestionAndAnswer());
        }
    }

    /**
     * 删除 index 下标处的问题
     */
    private delQuestion(index: number): void {
        this.questions.splice(index, 1);
    }

    /**
     * 更新信息, 服务端更新成功后才更新本地
     */
    private save(): void {
        axios.friend.updateAddMethod(this.produceData()).then(res => {
            if (res) {
                this.source = JSON.stringify(this.produceData());
            }
        });
    }

    /**
     * 将当前的活动数据封装为一个对象返回
     */
    private produceData(): any {
        let id: number = this.$store.getters.me().id;
        let mode: number = this.baseMode.indexOf(this.addMode) + 1;
        return {
            id: id, 
            mode: mode, 
            qas: this.questions
        }
    }

    /**
     * 判断是否进行了修改
     * 只需要将当前数据与源数据进行比较即可
     */
    private changed(): Boolean {
        return this.source.isEmpty() || JSON.stringify(this.produceData()) === this.source;
    }

}